<!-- 房屋认证首页 -->
<template>
	<view class="container">
		<view class="header"><view class="title">房屋认证</view></view>
		<view class="description-info">{{ params.projectName || '' }} {{ params.buildName || '' }} {{ params.unitName || '' }} {{ params.roomName || '' }}</view>
		<view class="unauthor">当前房屋未认证身份，请选择以下方式认证身份。</view>
		<view class="btn-container">
			<view class="btn" @click="toAuthor">户主认证</view>
			<view class="btn share" @click="queryShareUrl">家属/租户</view>
		</view>
		<modal v-if="show" @on-confirm="modalConfirm" @on-cancel="modalCancel"></modal>
	</view>
</template>

<script>
import http, { customUrl } from '@/common/request.js';
import { mapState } from 'vuex';
import { getCommonShareInfo } from '@/common/utils.js';
import Modal from '../components/modal.vue';
export default {
	data() {
		return {
			show: false,
			url: '',
			params: {}
		};
	},
	components: { Modal },
	computed: {
		...mapState({ userInfo: state => state.userInfo })
	},
	onLoad(option) {
		this.params = JSON.parse(decodeURIComponent(option.params || '{}'));
	},
	/**
	 * 分享事件
	 * @Author biao
	 */
	onShareAppMessage(res) {
		if (res.from === 'button') {
			if (res.target.id === 'shareBtn') {
				let url = encodeURIComponent(this.url);
				return {
					title: `我申请成为您的融创房产同住人，请审批`,
					imageUrl: 'https://mall-rongchuang.oss-cn-beijing.aliyuncs.com/guixin_miniProgram/img/personal/share.jpg',
					path: `/houseSetting/author/review?url=${url}`
				};
			}
		}
		return getCommonShareInfo();
	},

	methods: {
		queryShareUrl() {
			const {
				userInfo: { phonenumber, userId },
				params: { roomId }
			} = this;
			return http(customUrl.rongchuang + '/member/xcx/member/house/identity', {
				data: {
					userPhoneNum: phonenumber, //	string	是	32	用户手机号
					roomId: roomId, //	string	否		房间id
					identityType: '4' //	string	否		身份类型（身份类型1:业主、2：家属、3：朋友、4：租户）
				},
				method: 'GET'
			}).then(res => {
				if (res.success == true) {
					this.url = res.data;
					this.show = true;
				}
			});
		},
		/**
		 * 跳转认证页面
		 */
		toAuthor() {
			const { roomId, projectName, buildName, unitName, roomName } = this.params;
			uni.navigateTo({
				url: `./author?roomId=${roomId}&roomName=${projectName + buildName + unitName + roomName}`,
				animationDuration: 200,
				animationType: 'pop-in'
			});
		},
		async showTips() {
			if (this.url) {
				this.show = true;
			} else {
				uni.showToast({
					title: '该用户暂时无权申请',
					icon: 'none'
				});
				return false;
			}
		},
		/**
		 * 默认弹窗取消事件
		 */
		modalCancel() {
			this.show = false;
		},
		/**
		 * 默认弹窗确定事件
		 */
		modalConfirm() {
			this.show = false;
		}
	}
};
</script>
<style lang="less" scoped>
@import '../house.less';
.description-info {
	margin-top: 26rpx;
	color: #66645d;
}
.unauthor {
	margin-top: 200rpx;
	background-color: #f1f1f1;
	display: inline-block;
	padding: 24rpx;
	border-radius: 12rpx;
	font-size: 28rpx;
	color: #66645d;
	text-align: center;
}
.btn-container {
	padding: 60rpx 100rpx;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	bottom: constant(safe-area-inset-bottom);
	bottom: env(safe-area-inset-bottom);
	.btn {
		text-align: center;
		font-size: 30rpx;
		height: 72rpx;
		line-height: 72rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #ffffff;
		background: #f39800;
		border-radius: 72rpx;
		margin-bottom: 44rpx;
		&:last-child {
			margin-bottom: 0;
		}
	}
}
</style>
